<template>
    <div style="margin: 30px;">
        <!-- <el-button type="primary" size="medium" @click="returnOver">返回</el-button> -->
       <div style="margin: 30px 0">
            
            <el-form :inline="true" :model="queryData">
                <el-form-item label="创建时间：">
                            <el-date-picker
                            value-format="yyyy-MM-dd HH:mm:ss"
                            v-model="endtime"
                            type="datetimerange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                            @change="changeTime">
                    </el-date-picker>
                 </el-form-item>
                 <el-form-item label="单据编号：">
                    <el-input style="width: 300px;" v-model="queryData.moveNo" placeholder="请输入单据编号" size="medium"></el-input>
                        
                </el-form-item>
                <!-- <el-form-item label="调出位置">
                    <el-select v-model="queryData.outstore" size="medium" >
                        <el-option :value="item.id" :label="item.storeName" v-for="item in selectedOptions" :key="item.index"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="调入位置">
                    <el-select v-model="queryData.storeId" size="medium" @change="handleChange">
                        <el-option :value="item.id" :label="item.storeName" v-for="item in selectedOptions" :key="item.index"></el-option>
                    </el-select>
                    <el-select v-model="inputAreaId" size="medium" @change="handleChangetype">
                        <el-option :value="item.id" :label="item.areaName" v-for="item in deptData" :key="item.index"></el-option>
                    </el-select>
                </el-form-item> -->
               
                <el-form-item label="" style="margin-left:50px">
                    <el-button type="primary" size="medium" @click="queryAllcat">查询</el-button>
                    <el-button type="warning" size="medium" @click="Allcatrecord(queryData)">重置</el-button>
                </el-form-item>
                <el-form-item label="" style="margin-left:50px">
                    <el-button type="primary" size="medium" @click="newbuild">新建调拨</el-button>
                   
                </el-form-item>
            </el-form>
            <!-- <el-form :inline="true">
                    <el-form-item label="">
                        <el-input v-model="goodsId" autofocus @keyup.enter.native="smentry"  style="width:250px" placeholder="请录入商品ID"></el-input>
                    </el-form-item>
                    <el-form-item label="">
                        <el-button type="primary" size="medium" @click="smentry()">确定录入</el-button>
                    </el-form-item>
            </el-form> -->

    </div>
    <div class="wrapper">
            <el-table class="table" :data="tableData" stripe highlight-current-row border>
             <el-table-column
                type="index"
                width="50">
              </el-table-column>
              <!-- <el-table-column align="center" type="selection">
                </el-table-column> -->
              <el-table-column align="center" prop="addTime" label="创建时间">
              </el-table-column>
              <el-table-column align="center" prop="goodsId" label="商品id">
                </el-table-column>
              <el-table-column align="center" prop="moveNo" label="单据编号">
              </el-table-column>
              </el-table-column>
              <el-table-column align="center" prop="ageName" label="调出位置">
              </el-table-column>
              <el-table-column align="center" prop="nowName" label="调入位置">
              </el-table-column>
              <el-table-column align="center" prop="username" label="制单人">
              </el-table-column>
             
              <el-table-column align="center" prop="description" label="明细备注">
              </el-table-column>
              
            </el-table>
            <!-- <el-pagination background layout="total,prev, pager, next,jumper" :page-size="page.pageSize" :total="page.total" :current-page="page.current"
              @current-change="handleCurrentChange">
            </el-pagination> -->
            <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="page.current"
            :page-sizes="[10,20,30]"
            :page-size="page.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="page.total">
          </el-pagination>
          </div>
          <audio id="myaudio" src="../../../viode/004.mp3" controls="controls" hidden="hidden" ></audio>
          <audio id="warn" src="../../../viode/warn.mp3" controls="controls"  hidden="hidden"></audio>
    </div>
</template>
<script>
        export default{
            data(){
                return{
                   
                    inputAreaId:'',
                    selectedOptions:[],
                    deptData:[],
                    inType:'',
                    unusedNum:'',
                    page: {
                        pageSize: 10,
                        current: 1,
                        total: null
                    },
                    tableData:[],
                   
                    endtime:'',
                    queryData: {
                        startTime:'',
                        endTime:'',
                        moveNo:'',
                        outstore:'',
                        storeId:'',
                       
                        
                    },
                }
            },
            mounted () {
                this.area();
                this.inintable();
            },
            methods: {
                //货位
                handleChangetype(id){
                    // this.numinfo(id)
                   
                },
                //仓库
                handleChange(id){
                    this.inputAreaId = '';
                    this.areainfo(id)
                   
                },
                //查询
                queryAllcat(){
                   this.inintable();
                },
                //新建
                newbuild(){
                    this.$router.push({path:'/alloCation'})
                },
                //重置
                Allcatrecord(formName){
                    // console.log(formName)
                formName.endTime = '';
                formName.startTime = '';
                  formName.outstore = ''
                   formName.storeId = ''
                  formName.moveNo = '';
                  this.endtime = '';
                },
                //页码
                handleSizeChange(value){
                    this.page.pageSize = value;
                    this.inintable();
                },
                handleCurrentChange(value){
                    this.page.current = value;
                    this.inintable();
                },
                
                changeTime(arr){
                    console.log(arr)
                    if(arr != null){
                        this.queryData.startTime = arr[0];
                        this.queryData.endTime = arr[1];
                    }else{
                        this.queryData.startTime = '';
                        this.queryData.endTime = '';
                    }
                },
               
                async inintable(){
                   
                    try{
                        let {data} = await this.$post({
                            api:'/show/allmove',
                            data:{
                                current:this.page.current,
                                pageSize:this.page.pageSize,
                                moveStatus:1,
                                startTime:this.queryData.startTime,
                                endTime:this.queryData.endTime,
                                moveNo:this.queryData.moveNo
                            }
                        })
                        if(data.code === 0){
                            this.tableData = data.data;
                            this.page.total = data.rdPage.total;
                            console.log(data)
                        }
                    }catch(error){

                    }
                },
                
                //仓库
                async area() {
                
                try {
                 
                  let { data } = await this.$post({
                    api: "/show/store/area"
                    
                  });
                  
                  if (data.code === 0) {
                    this.selectedOptions = data.data;
                 
                  } else {
                    this.$message({
                      type: "error",
                      message: data.msg
                    });
                  }
                } catch (e) {
                  // this.$message({
                  //   type: "error",
                  //   message: "接口报错"
                  // });
                }
              },
              //根据仓库id货位
           async areainfo(id) {
              try {
                let { data } = await this.$post({
                  api: "/show/store/areainfo",
                  data:{
                    storeId:id
                  }
                });
                if (data.code === 0) {
                  
                  this.deptData = data.data;
                  // this.inType = data.data[0].areaType;
                  // this.unusedNum = data.data[0].unusedNum;
                console.log(data)
                } else {
                  this.$message({
                    type: "error",
                    message: data.msg
                  });
                }
              } catch (e) {
                // this.$message({
                //   type: "error",
                //   message: "接口报错"
                // });
              }
           },
              returnOver(){
                  this.$router.go(-1);
              }
               
               
            }
        }
    </script>